<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../include/base.jsp" %>
<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">	
	<title>CRM-deal-show</title>
	<meta charset="UTF-8">
	<%@ include file="../include/head.jsp" %>
</head>

<body class="crm">
	
<jsp:include page="../include/top.jsp">
	<jsp:param value="deal" name="tag"/>
</jsp:include>


<div class="container-fluid">
	<div class="row-fluid">
	
	<div class="span8">
	<div class="well screen">
	<div class="page-header header">
							

		<table style="width:100%;">
		<tbody>
			<tr>
				<td width="68" style="vertical-align:top;">
					<span class="icon-larget-dollar"></span>
				</td>
				<td>
					<div class="right-links">
								由 <strong>${deal.user.username }</strong> 添加 |
							<a href="${basePath }/deal/edit?id=${deal.id}" rel="tooltip" data-original-title="修改机会"><i class="icon icon-edit"></i></a>
					</div>
					
					<a href="https://1339135738.workxp.info/people/485191">${deal.title }</a>:
					${deal.content }
					
					<div class="details" style="font-size:14px;">
						<c:if test="${deal.money == '0' }" >
							没有设置金额
						</c:if>
						<c:if test="${deal.money != '0' }">
							￥${deal.money }
						</c:if>
					</div>
				
					<div class="btn-group state-switcher" data-toggle="buttons-radio">
						<button class="btn pending ${deal.state == 'pending' ? 'active' : '' }" state="pending" data-loading-text="处理中..">跟踪</button>
						<button class="btn success ${deal.state == 'won' ? 'active' : '' }" state="won" data-loading-text="处理中..">成功</button>
						<button class="btn important ${deal.state == 'lost' ? 'active' : '' }" state="lost" data-loading-text="处理中..">失败</button>
						<input type="hidden" value="${deal.id }" id="state-id"/>
					</div>
				</td>
			</tr>
		</tbody>
		</table>

		</div>
		
		
		<script type="text/javascript" charset="utf-8">
			$(document).ready(function() {
				
				$.each($('.state-switcher .btn'), function(index, item) {
					$(item).live('click', function(event) {
						if(confirm('确定要改变机会状态为' + $(item).text() + '?')) {
							$(item).button('loading');
							var id = $("#state-id").attr("value");
							$.post("${basePath}/deal/setstate",{"state":$(item).attr("state"),"id":id},function(){
								$(item).button("reset");
							});
						} else {
							return false;
						}
					});
				});
				
				//task list
				$.get('/tasks/target?target_type=Chance&target_id=4154', function(data) {
					$('#tasks_div').html(data);
				}, 'html');
			});
		</script>
		
		<div class="live_search_spinner" behavior="spinner" id="parties_loading">
		  <div class="liner">
		    <h3>处理中...</h3>
		    <img src="${basePath }/img/indicator.gif" alt="WorkXP">
		  </div>
		</div>
		<div class="main" id="main">

		
		<div>
		<form accept-charset="UTF-8" action="${basePath }/contactnote/edittype" class="simple_form new_note" data-remote="true" id="note-form" method="post" novalidate="novalidate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="KFONXAgrV80PCacx2RHhLc5VP7xbjWRF+58BzWueBLs="></div>
			<input id="from" name="from" type="hidden" value="Chance">
			<input id="note_parent_id" name="note[parent_id]" type="hidden">
			<input id="note_contact_id" name="note[contact_id]" type="hidden">
			<input id="note_chance_id" name="note[chance_id]" type="hidden" value="4154">
			<input id="note_kase_id" name="note[kase_id]" type="hidden">
			
			<div class="control-group text required">
				<div class="controls">
					<textarea class="text required content" cols="40" id="note_content" name="note[content]" rows="20"></textarea>
				</div>
			</div>
	
			<div class="new_note_form_basics">
				<div class="submit right">
					<input class="btn btn-primary" data-loading-text="处理中.." name="commit" type="submit" value="添加事件">
				</div>
			</div>
		</form>
		</div>
	
	
		<script type="text/javascript" charset="utf-8">
		
			
			// auto_size_textarea('holder_', 'note_content_');  
			$(document).ready(function() {
				validate_form('#note-form', true);
				PendingAttachments.init(".attachment_container");
				$('#note_content').focus();
			});
		</script>


		<table id="activities" class="table top no-hover" style="margin-bottom: 60px">
		<tbody>
			<tr id="note-765299" data="765299" data-from="Chance">
			<td class="icon"><span class="sprite note"></span></td>
			<td>
				<div class="meta">
					<div style="float:right">
						 <ul class="nav nav-pills">
					 		<li><a href="https://1339135738.workxp.info/notes/765299">评论</a></li>
							<li><a href="${basePath }/deal/edit?id=${deal.id}" title="编辑">编辑</a></li>
				 			<li>
								<a href="https://1339135738.workxp.info/notes/765299" data-confirm="如果事件有评论，所有评论都会一并删除。 
		您确定要删除这个事件吗？" data-method="delete" data-remote="true" rel="nofollow" title="删除">删除</a>
							</li>
						 </ul>
					</div>
					shy935397008 添加
					于 6月08日 17:58 星期五
				</div>
				<div class="content">
						<p>定金</p>
				</div>
					
			</td>
			</tr>
	
		</tbody>
		</table>

		<div id="load-more">
			
		</div>

		<style>
		.meta {
			line-height: 26px;
		}
		.meta li span {
			padding: 4px 8px;
			font-weight:blod;
		}
		.meta	.nav-pills li a {
		  padding: 4px 8px;
		}
		.meta .nav {
			margin-bottom: 0px;
		}
		</style>
		<script>
			$(document).ready(function() {
				$("#activities").on("click", function(e) {
					var target = $(e.target);
					if(target.is("ul.dropdown-menu a[chance-id]")) {
						e.preventDefault();
						var noteId = target.parents("tr").attr("data");
						var from = target.parents("tr").attr("data-from");
						var url = "/notes/" + noteId + "/regarding";
						$.ajax({type: 'PUT', url: url, data: {"from": from, "chance_id":target.attr("chance-id")}});
					}
				});
			});
		</script>

		
	</div>
	</div>
	</div>
	
	<div class="span4 sidebar">
		<div id="tasks_div" class="well">
			<div class="title">
				<span><a data-toggle="modal" href="https://1339135738.workxp.info/chances/4154#taskModal" data-backdrop="static">添加任务</a></span>
				待办任务
			</div>
			<div id="upcoming_tasks">
				<div id="screen_body">
					<c:if test="${fn:length(pastList) != 0 }">
					<legend>已过期</legend>
					<c:forEach items="${pastList }" var="p">
					<div id="task_${p.id }" class="task checkbox">
						<span class="task_hover">
							<div class="task_actions">
								<a href="${basePath }/task/del?id=${p.id}" id="${p.id }" class="icon icon-trash" data-confirm="您确定要删除这个任务吗？" data-method="delete" data-remote="true" rel="nofollow" title="删除这个任务"></a>
								<a href="${basePath }/task/tasktype" class="edit" data-remote="true">编辑</a>
							</div>
							
							<input data-confirm="您确定要完成分配给 shy935397008 的任务吗？" id="task_done_${p.id }" name="task_done" onclick="done_task(this)" type="checkbox" value="${p.id }" alt="${p.user.username }">
							<c:if test="${p.tasktype.type != null }">
								<span style="background:#${p.tasktype.color};" class="label">${p.tasktype.type }</span>
							</c:if>
							${p.user.username }:${p.title }
						</span>
					</div>
					</c:forEach>
				</c:if>
				<c:if test="${fn:length(todayList) != 0 }">
					<legend>今日任务</legend>
					<c:forEach items="${todayList }" var="td">
					<div id="task_${td.id }" class="task checkbox">
						<span class="task_hover">
							<div class="task_actions">
								<a href="${basePath }/task/del?id=${td.id}" id="${td.id }" class="icon icon-trash" data-confirm="您确定要删除这个任务吗？" data-method="delete" data-remote="true" rel="nofollow" title="删除这个任务"></a>
								<a href="${basePath }/task/tasktype" class="edit" data-remote="true">编辑</a>
							</div>
							
							<input data-confirm="您确定要完成分配给 shy935397008 的任务吗？" id="task_done_${td.id }" name="task_done" onclick="done_task(this)" type="checkbox" value="${td.id }" alt="${td.user.username }">
							<c:if test="${td.tasktype.type != null }">
								<span style="background:#${td.tasktype.color};" class="label">${td.tasktype.type }</span>
							</c:if>
							${td.user.username }:${td.title }
						</span>
					</div>
					</c:forEach>
				</c:if>
				<c:if test="${fn:length(tomorrowList) != 0 }">
					<legend>明日任务</legend>
					<c:forEach items="${tomorrowList }" var="t">
					<div id="task_${t.id }" class="task checkbox">
						<span class="task_hover">
							<div class="task_actions">
								<a href="${basePath }/task/del?id=${t.id}" id=${t.id } class="icon icon-trash" data-confirm="您确定要删除这个任务吗？" data-method="delete" data-remote="true" rel="nofollow" title="删除这个任务"></a>
								<a href="${basePath }/task/tasktype" class="edit" data-remote="true">编辑</a>
							</div>
							
							<input data-confirm="您确定要完成分配给 shy935397008 的任务吗？" id="task_done_${t.id }" name="task_done" onclick="done_task(this)" type="checkbox" value="${t.id }" alt="${t.user.username }">
							<c:if test="${t.tasktype.type != null }">
								<span style="background:#${t.tasktype.color};" class="label">${t.tasktype.type }</span>
							</c:if>
							${t.user.username }:${t.title }
						</span>
					</div>
					</c:forEach>
				</c:if>
				<c:if test="${fn:length(laterList) != 0 }">
					<legend>明日以后任务</legend>
					<c:forEach items="${laterList }" var="la">
					<div id="task_${la.id }" class="task checkbox">
						<span class="task_hover">
							<div class="task_actions">
								<a href="${basePath }/task/del?id=${la.id}" id=${la.id } class="icon icon-trash" data-confirm="您确定要删除这个任务吗？" data-method="delete" data-remote="true" rel="nofollow" title="删除这个任务"></a>
								<a href="${basePath }/task/edittask" class="edit" data-remote="true">编辑</a>
							</div>
							
							<input data-confirm="您确定要完成分配给 shy935397008 的任务吗？" id="task_done_${la.id }" name="task_done" onclick="done_task(this)" type="checkbox" value="${la.id }" alt="${la.user.username }">
							<c:if test="${t.tasktype.type != null }">
								<span style="background:#${t.tasktype.color};" class="label">${la.tasktype.type }</span>
							</c:if>
							${la.user.username }:${la.title }
						</span>
					</div>
					</c:forEach>
				</c:if>
				<c:if test="${fn:length(taskList) == 0 }" var="task">
					<div id="upcoming_tasks">
						<div class="alert alert-info"> 没有待办任务，或者已经完成了所有任务！ </div>
					</div>
				</c:if>
				</div>
			</div>	
		</div>
	
		<script type="text/javascript">
			//删除：set view为false
			$("a[data-method='delete']").click(function(){
				var id = $(this).attr("id");
				$("#task_"+id).fadeOut('slow',function(obj){
					$(obj).remove();
				});
			});
			
			//标注为完成
			function done_task(obj){
				var id = $(obj).attr("value");
				var name = $(obj).attr("alt");
				if(confirm("您确定要完成分配给 "+name+" 的任务吗？")){
					$.post("${basePath}/task/done",{"id":id},function(){
						$("#task_"+id).fadeOut('slow',function(obj){
							$(obj).remove();
						});
					});
				}else{
					$(obj).attr("checked",false);
				}
			}
		</script>
		<script type="text/javascript" charset="utf-8">
			$(document).ready(function() {
				$('span.task_hover').hover(function() {
					$(this).children().first().show();
				}, function() {
					$(this).children().first().hide();
				});
			});
		</script>
	
	
		<div class="well">
		 	<div id="background_container">
				<div class="title">
			  		<span><a href="https://1339135738.workxp.info/chances/4154#" onclick="toggle_edit_background_info(true); return false;">编辑</a></span>
			  		背景信息
			  	</div>
			  	<div id="background_info"><p>${deal.content }</p></div>
			</div>
		
		 <div id="edit_background_container" style="display:none;">
		  	<!-- <form accept-charset="UTF-8" action="${basePath }/mecrm/editDesc data-remote="true" id="background_form" method="post" novalidate="novalidate"> -->
		  	<div style="margin:0;padding:0;display:inline">
		  		<input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="KFONXAgrV80PCacx2RHhLc5VP7xbjWRF+58BzWueBLs="></div>
				<input id="target_type" name="target_type" type="hidden" value="${deal.id }">
				<input id="target_id" name="target_id" type="hidden" value="4154">
				<div class="control-group text optional">
					<label for="contact_others" class="text optional control-label"> 修改背景信息</label>
					<div class="controls">
						<textarea class="content" id="description" name="description" required="required">${deal.content }</textarea>
					</div>
				</div>
		  		<div class="submit">
		  			<input class="btn btn-primary" name="commit" id="edit-content" type="submit" value="保存">
					<a class="btn" href="https://1339135738.workxp.info/chances/4154#" onclick="toggle_edit_background_info(); return false;">取消</a>
		  		</div>
			<!-- </form> -->  
		</div>
		</div>

		<script type="text/javascript">
			$(document).ready(function(){
				$("#edit-content").click(function(){
					var des = $("#description");
					
					var btn = $(this);
					btn.button("loading");
					/*setTimeout(function () {
						btn.button("reset");
					}, 500);*/
					if(des.val().trim() != null){
						$.post("${basePath}/deal/editDes",{"desc":des.val().trim(),"id":$("#target_type").attr("value")},function(obj){
							$("#background_info").text(obj);
							$('#background_container').slideDown("slow");
							$('#edit_background_container').slideUp("slow");
							btn.button("reset");
						});
					}
				});
			});
		</script>

		<script type="text/javascript" charset="utf-8">
			$(document).ready(function() {
				validate_form("#background_form", true);
			});
			function toggle_edit_background_info(edit) {
				$('#background_container').slideToggle();
				$('#edit_background_container').slideToggle();
				if (edit) $('#description').focus();
			}
		</script>
		
		<div id="show_contacts_in_collection" class="well">
			<div class="title">
				<span><a href="https://1339135738.workxp.info/chances/4154#" onclick="manage_contacts(true); return false;">添加/删除</a></span>
				相关联系人
			</div>
		
			<table class="table crm-table involvements">
				<tbody>
					<tr id="involvement-${deal.contact.id }">
						<td class="avatar">
							<a href="https://1339135738.workxp.info/chances/4154#" data-id="485191" class="quick-view"><span style="display: inline-block;border:1px solid #CCCCCC;background: url(${basePath}/img/workxp_sprites.png) no-repeat -112px -148px transparent; width: 32px; padding-top: 32px;font-size:1px"></span></a>
						</td>
						<td>
							<h4><a href="${basePath }/contact/show?id=${deal.contact.id}">${deal.contact.name }</a></h4>
							<a href="${basePath }/contact/showcompany?id=${deal}">${deal.contact.companyname }</a>
							${deal.contact.title }
						</td>
						<td class="actions">
							
						</td>
					</tr>
				</tbody>
			</table>
		</div>

		<div id="manage_contacts_in_collection" class="well" style="display:none">
			<div class="title">
				添加联系人
				<span><a href="https://1339135738.workxp.info/chances/4154#" onclick="manage_contacts(false); return false;">完成</a></span>
			</div>
			
			<div style="position:relative;padding-top:5px;">
				<div class="marco_polo_container">
					<input id="candidates" name="candidates" placeholder="通过搜索联系人添加" type="text" class="mp_input" autocomplete="off"><ul class="typeahead dropdown-menu mp_list" style="display: none; "></ul>
					<img alt="Indicator" class="spinner" id="candidates-indicator" src="${basePath }/img/indicator-57b9a4bc69531739d1aefa7c33cdcd08.gif" style="height:5px;width:21px;vertical-align: middle; display: none;">
				</div>
			</div>
			
			<h4 style="margin: 8px 0 5px;font-weight: normal;">已关联的联系人</h4>
			<table class="table crm-table involvements">
				<tbody><tr id="involvement-485191">
			<td class="avatar">
				<a href="${basePath }/contact/show?id=${deal.contact.id}" data-id="485191" class="quick-view"><span style="display: inline-block;border:1px solid #CCCCCC;background: url(${basePath}/img/workxp_sprites.png) no-repeat -112px -148px transparent; width: 32px; padding-top: 32px;font-size:1px"></span></a>
			</td>
			<td>
				<h4><a href="${basePath }/contact/show?id=${deal.contact.id}">${deal.contact.name }</a></h4>
				<a href="${basePath }/contact/showcompany?id=${deal}">${deal.contact.companyname }</a>
				${deal.contact.title }
			</td>
			<td class="actions">
				
			</td>
		</tr>
				
			</tbody></table>
		</div>


		<script type="text/javascript" charset="utf-8">
			function manage_contacts(edit){
				$('#show_contacts_in_collection').toggle();
				$('#manage_contacts_in_collection').toggle();
				if (edit) $('#candidates').focus();
			}
			
			$(document).ready(function() {
				ContactQuickShow.init();
				
				$('#candidates').marcoPolo({
				  url: '/contacts/auto_complete_for_contact_name',
				  formatItem: function (data, $item) {
				    var ns = data.icon + data.name;
						if(data.company) ns = ns + ' [' + data.company + ']';
						return ns;
				  },
				  onSelect: function (data, $item) {
						$('#candidates').val(data.name);
						$('#candidates-indicator').show();
						$.post("/involvements", {"target_type": "Chance", "target_id": 4154, "id": data.id});
		
				  },
					formatNoResults: function(q, $item) {
						return '';
					}
				});
			});
		</script>

	</div>
</div>
</div>
	


</body></html>
